<!DOCTYPE html>
<%@page import="org.springframework.context.ApplicationContext"%>
<%@page import="org.springframework.web.servlet.DispatcherServlet"%>
<%@page import="org.springframework.web.context.ContextLoaderListener"%>
<%@page import="com.swadar.dao.BrandDAO"%>
<%@page import="com.swadar.beans.dataobject.CategoryDO"%>
<%@page import="com.swadar.beans.dataobject.BrandDO"%>
<%@page import="com.swadar.beans.valueobject.ProductVO"%>
<%@page import="java.util.List"%>
<html lang="en">
<head>
	
	<script type="text/javascript">
		function myForm(index){
			document.getElementById("product"+index).submit();
		}
	</script>
	<script type="text/javascript">
		function brandForm(count){
			document.getElementById("brand"+count).submit();
		}
	</script>
	
<meta charset=utf-8>
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1" />
<title>Drinking is good for health..</title>
<meta charset="UTF-8" />
<!--<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> 
<meta name="keywords" content="carousel, jquery, responsive, fluid, elastic, resize, thumbnail, slider" />
<meta name="author" content="Codrops" />-->
<link rel="stylesheet" type="text/css" href="/liquor/resources/css/elastislide.css" />
<link rel="stylesheet" type="text/css" href="/liquor/resources/css/custom.css" />
<link rel="stylesheet" type="text/css" href="/liquor/resources/css/pop-up.css"/>
<link rel="stylesheet" type="text/css" href="/liquor/resources/css/default.css" />
<link rel="stylesheet" type="text/css" href="/liquor/resources/css/component.css" />
<link rel="stylesheet" type="text/css" href="/liquor/resources/css/pop-up.css"/>
<link href="/liquor/resources/css/style.css" rel="stylesheet" />



<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<script src="/liquor/resources/js/script.js"></script>
<script src="/liquor/resources/js/pop-script.js"></script>
<script src="/liquor/resources/js/modernizr.js"></script>
<script src="/liquor/resources/js/conditional.js"></script>
<script src="/liquor/resources/js/unslider.min.js"></script>
<script src="/liquor/resources/js/modernizr.custom.17475.js"></script>
<script src="/liquor/resources/js/jquerypp.custom.js"></script>
<script src="/liquor/resources/js/jquery.elastislide.js"></script>
<script src="/liquor/resources/js/pagination.js"></script>
<script src="/liquor/resources/js/jquery.simplePagination.js"></script>



<script>
	$(function () {
		//$('#banner_wrapper ul').hide().removeClass('fallback');
		$('#all_categories span a').hover(function () {
			$('#banner_wrapper .fallback').css({display:"block"});
			$('#banner_wrapper .banner').css({display:"none"});
			});
		$('#header_con').mouseenter(function(){
			$('#banner_wrapper .fallback').css({display:"none"});
			$('#banner_wrapper .banner').css({display:"block"});
			});
			
			$('.cbp-hrmenu').mouseenter(function(){
			$('#banner_wrapper .fallback').css({display:"none"});
			$('#banner_wrapper .banner').css({display:"block"});
			});
	
		$('#product_header').mouseenter(function(){
			$('#banner_wrapper .fallback').css({display:"none"});
			$('#banner_wrapper .banner').css({display:"block"});
			});
			
			$('.fallback').mouseleave(function(){
			$('#banner_wrapper .fallback').css({display:"none"});
			$('#banner_wrapper .banner').css({display:"block"});
			});
			
	});
	</script>


<!--<script src="/liquor/resources/js/script.js"></script>-->

<!-- Notes: in a production environment, JS scripts and CSS should be concatenated. More scripts means more http requests which in turn means a slower site. Also comments would be removed to make the file as lean as possible. Finally, it's usually best to put links to all <script> files just before the final </body> tag. That way, the document has loaded before the JavaScript attempts to manipulate anything. However, I've left it in the head here so you see it! BF. -->
</head>
<body>
<!-- Wrapper Section begins From Here -->
	<div id="wrapper">
    
    	<!-- Top Header -->
        <div id="top_header">
        	<div id="navigation">
            	<div id="right_align">
                     <a href="#" class="topopup_2">Register</a>
                     <a href="#" class="topopup">Login</a>
                     <a href="#">Wish list</a>
                     <a href="#">Help</a>
                 </div>
             </div>
        </div>
        <!-- Top Header Ends Here -->
        <div class="clear"></div>
        <!--<header>
        	<div id="header_con">
                <div id="header_div">
                    <a  class="header_a" href="/"><img src="/liquor/resources/images/liq-logo.png" alt="Liquor-Portal"/></a>
                    <nav> 
                        <ul id="mainNav">
                            <li><a href="index.html">HOME</a></li>
                            <li><a href="about.html">BEER</a></li>
                            <li><a href="offline.html">WHISKY</a></li>
                            <li><a href="redemption.html">SCOTCH</a></li>
                            <li><a href="video.html">VODKA</a></li>
                            <li><a href="3Dquiz.html">WINE</a></li>
                            <li><a href="3Dquiz.html">GIFTS</a></li>
                            <li><a href="3Dquiz.html">BARWARES</a></li>
                        </ul>
                    </nav> 
                    <div id="cart_store">
                    	<div id="cart_icon"><img src="/liquor/resources/images/shopping.jpg" alt="cart-detail"/></div>
                    </div>
                    <div id="cart_des">My cart (0)</div>	
                </div>
            </div>
		</header> -->
    <!--Menu section -->
    	<div id="header_con">
				<nav id="cbp-hrmenu" class="cbp-hrmenu">
					<ul>
                    	<li><img src="/liquor/resources/images/liq-logo.png" alt="Liquor-Portal"/></li>
                        <li><a href="home.jsp" class="mar-top mar_right">HOME</a></li>
			
						<% List categoryList = (List) request.getAttribute("categoryList"); 
							for(int i=0; i<5; i++){
								CategoryDO categoryDO = (CategoryDO) categoryList.get(i);
						%>
						<li>
							<a href="#" class="mar-top"><%=categoryDO.getName() %></a>
							<div class="cbp-hrsub">
								<div class="cbp-hrsub-inner">
									<div>
										<h4><%=categoryDO.getName()%> <span>&#215;</span></h4>
										<%BrandDAO brandDAO = ((ApplicationContext)(request.getAttribute(DispatcherServlet.WEB_APPLICATION_CONTEXT_ATTRIBUTE))).getBean(BrandDAO.class);
											Long categoryId = categoryDO.getId();
											List brandList = brandDAO.getBrandNameList(categoryId);
											for(int j=0; j < brandList.size(); j++){
												BrandDO brandDO = (BrandDO) brandList.get(j);
										%>
										<ul>
											<li><a href="/liquor/productHome.do?brandId=<%=brandDO.getId()%>&categoryId=<%=brandDO.getId()%>"><%=brandDO.getName()%></a></li>
										</ul>
											<%}%>
									</div>
								</div><!-- /cbp-hrsub-inner -->
							</div><!-- /cbp-hrsub -->
						</li>
						<%}%>

                        <li><a href="" class="mar-top">GIFTS</a></li>
                        <li><a href="" class="mar-top">BARWARES</a></li>
                        <li class="mar-topcart">
                                <div style="width:100%; background:#F00;">
                                	<div id="cart_store">
                                		<div id="cart_icon"><img src="/liquor/resources/images/shopping.jpg" alt="cart-detail"/></div>
                               		</div>
                                	<div id="cart_des">My cart (0)</div>
                                </div>
                        </li>
					</ul>
				</nav>
			</div>
		
    <!--Menu Section Ends Here -->
    <div class="clear"></div>
    <!-- Header Section Ends Here-->
    
    <!-- Content Area -->
    	<div id="content_area">
        	<div id="all_categories"><span><a href="#">All CATEGORIES</a></span></div>
            <div id="contact_no"><span>CALL NOW</span><br>080 66778899</div>
            <!--Search- Box Starts From Here -->
           	<div id="search_box">
				<form id="search-form" method="post" enctype="multipart/form-data">
					<fieldset>
						<div class="search-field">
							<input name="search" type="text" placeholder="search" />
							<a class="search-button" href="#" onclick="document.getElementById('search-form').submit()" >#</a>
						</div>
					</fieldset>
				</form>
			</div>
      	</div>
        <div class="clear"></div>
        <!-- Content Header Ends Here-->
        <!-- This section is for hide and play-->
       
        <!-- do the div man--> 
        <!-- Banner Section Commence Here -->
        
        <div id="banner_wrapper">
        	<!-- div for hide and seek-->
            <div class="fallback">
            <%  int count = 0;
        		int size = categoryList.size();
            	for(int i=0; i<categoryList.size(); i++){
            	if(size > 1){
            	CategoryDO categoryDO = (CategoryDO) categoryList.get(i);
            	CategoryDO category = (CategoryDO) categoryList.get(i+1);
            %>
            	<div id="all_textcontainer<%=count%>">
                    <h5><%=categoryDO.getName()%> <span>&#215;</span></h5>
                    <% BrandDAO brandDAO = ((ApplicationContext)(request.getAttribute(DispatcherServlet.WEB_APPLICATION_CONTEXT_ATTRIBUTE))).getBean(BrandDAO.class);
                    	Long categoryId = categoryDO.getId();	
                    	List brandList = brandDAO.getBrandNameList(categoryId);
                    	for(int j=0; j<brandList.size(); j++){ 
                    	BrandDO brandDO = (BrandDO) brandList.get(j); %>
                    		<p><a href="/liquor/productHome.do?brandId=<%=brandDO.getId()%>&categoryId=<%=categoryDO.getId()%>"><%=brandDO.getName()%></a></p><br>
                    <%}%>
                    <h5><%=category.getName()%> <span>&#215;</span></h5>
                    <%Long id = category.getId();
                    	List list = brandDAO.getBrandNameList(id);
                    	for(int k=0; k<list.size(); k++){ 
                        	BrandDO brandDO = (BrandDO) list.get(k);
                    %>
                    	<p><a href="/liquor/productHome.do?brandId=<%=brandDO.getId()%>&categoryId=<%=category.getId()%>"><%=brandDO.getName()%></a></p><br>
                    <%}%>
                    </div>
                    
                   <%
				   	i = i + 1;
					size = size - 2;
				   }else if(size == 1){
                   		CategoryDO catgoryDo = (CategoryDO) categoryList.get(i);
                   %>
                   	<div id="all_textcontainer<%=count%>">
                   	<h5><%=catgoryDo.getName() %> <span>&#215;</span></h5>
                    	<% BrandDAO brandDAO = ((ApplicationContext)(request.getAttribute(DispatcherServlet.WEB_APPLICATION_CONTEXT_ATTRIBUTE))).getBean(BrandDAO.class);
                    		Long categoryId = catgoryDo.getId();	
                    		List brandList = brandDAO.getBrandNameList(categoryId);
                    		for(int j=0; j<brandList.size(); j++){ 
                    		BrandDO brandDO = (BrandDO) brandList.get(j); %>
                    			<p><a href="/liquor/productDetail.do?brandId=<%=brandDO.getId()%>&categoryId=<%=catgoryDo.getId()%>"><%=brandDO.getName() %></a></p><br>
                    	<%}%>
                   </div>
                   <%}%>
                
            <% count = count+1;
            	
            	
            }%>
                <div id="all_imagecontainer">
                	<a href="#"><div id="all_catimage">
                    	<img src="/liquor/resources/images/allCategory.jpg"/>
                    </div>
                    <p>CHEVAS REGAL</p>
                    <div id="rupee_symbolcontainer"><img src="/liquor/resources/images/rupee-symbol.png"/><p>&nbsp;&nbsp;&nbsp;&nbsp;1320</p></div>
                    </a>
                </div>
            </div>
            
        	<div class="banner has-dots">
				<!-- <ul>
                    <li><img src="/liquor/resources/images/img_1.jpg" /></li>
                    <li><img src="/liquor/resources/images/img_2.jpg" /></li>
                    <li><img src="/liquor/resources/images/img_3.jpg" /></li>
                    <li><img src="/liquor/resources/images/img_4.jpg" /></li>
                    <li><img src="/liquor/resources/images/img_5.jpg" /></li>
                   
                 </ul>-->
			</div>
        </div>
        <!-- Banner Scetion Ends Here -->
        
 <!-- Product Section Commence Here -->
 		<div class="clear"></div>
        <div id="product_header"><div id="header_text">FEATURED PRODUCTS</div><div id="product_header_arrow"><img src="/liquor/resources/images/header-arrow.jpg" alt="Arrow" /></div></div>
        <div class="clear"></div>
		<%List productList = (List) request.getAttribute("productList");
			int productPerRow = 4;
			int totalRow = 0;
			int reminderRow = 0;
			totalRow = productList.size() / productPerRow;
			reminderRow = (productList.size() % productPerRow > 0) ? 1 : 0;
			totalRow = totalRow + reminderRow;
			count = 0;
			int container = 1;
		%>
		 	
		 
		<div id="product_wrapper" class="product_border">
			<%for (int i = 0; i < totalRow; i++) {
				 
				for (int j = 0; j < productPerRow; j++) {
					
					 if (productList.size() > count) {
						 ProductVO productVO = (ProductVO) productList.get(count);
						if (j == productPerRow - 1) {%>
							<div id="product_con<%=container%>" onMouseOver="check('product_con');">
						<%}else{%>
							<div id="product_con<%=container%>" class="right_mar" onMouseOver="check('product_con');">
					   <%}%>
			    <form action="/liquor/product.do" id="product<%=count%>"> 
				<div id="img_con">
					<img src="/liquor/resources/images/<%=productVO.getImage()%>" alt="" onclick="myForm(<%=count%>)" />
				</div>
					<div class="clear"></div>
					<a id="addCart" href="" class="first"> <span class="cart_icon"><img src="/liquor/resources/images/cartnew.png" alt="add to Cart" /></span> Add to Cart</a> 
					<a href="" id="wishlist"> <span>S</span>&nbsp;&nbsp;&nbsp;Wish list</a> 
					<a href="" id="zoom"><span>#</span>&nbsp;&nbsp;Compare </a>
					<div id="price">
					<div id="price_symbol"><img src="/liquor/resources/images/rupee-symbol.png" alt="Indian Rupee" /></div><%=productVO.getPrice()%></div>
					<div id="p_header"><%=productVO.getName()%></div>
					<div class="clear"></div>
					<div id="p_desc"><%=productVO.getDescription()%></div>
					<input type="hidden" name="id" value="<%=productVO.getId()%>">
				</form>
				</div>
				<%if(container < 8){
					container = container + 1;;
					} else{
						container = 1;	
					}
					}
					count = count + 1;
				
				 }
				 %>
				<!--<div class="clear"></div>-->
			   <%}%>
			</div>
			
			<!-- END -->        
           
            <div class="clear"></div>
        </div>
         <div class="clear"></div>
         <!-- Pagination Code Begins From Here -->
      <!--   <ul id="rmc-pagin">
			<li id="first_btn"><a href="#">First</a></li>
			<li id="prev_btn"><a href="#">&lt;&lt;</a></li>
            <li class="line-heights">1 of 10 Pages</li>
			<li id="next_btn"><a href="#">&gt;&gt;</a></li>
			<li id="last_btn"><a href="#">Last</a></li>
		</ul>-->
        <div class="pages_container">
         <div class="pages" align="center";></div>
         </div>
        <div class="clear"></div>
         <!-- PAgination Code Ends Here -->
         <!-- Featured Brand Section Commence From Here-->
         <div id="featured_header">&nbsp;&nbsp;FEATURED BRANDS</div>
       	 <div class="clear"></div>
         <!--<div id="brand_wrapper">
         	<div id="left_arrow">left</div>
            <div id="brand_imgcon"><img src="/liquor/resources/images/brand.jpg" alt=""/></div>
            <div id="brand_imgcon"><img src="/liquor/resources/images/brand.jpg" alt=""/></div>
            <div id="brand_imgcon"><img src="/liquor/resources/images/brand.jpg" alt=""/></div>
            <div id="brand_imgcon"><img src="/liquor/resources/images/brand.jpg" alt=""/></div>
            <div id="brand_imgcon"><img src="/liquor/resources/images/brand.jpg" alt=""/></div>
            <div id="brand_imgcon"><img src="/liquor/resources/images/brand.jpg" alt=""/></div>
            <div id="right_arrow">right</div>
            <div class="clear"></div>
         </div>-->
         <!-- Old Section Ends Here -->


         <!-- New Section Commence Here -->
         
			<div class="container_scrolldiv demo-1">
            <div class="main_scrolldiv">
				<!-- Elastislide Carousel -->
				<ul id="carousel" class="elastislide-list">
					<%List list = (List) request.getAttribute("imageList");
						count = 1;
			         	for(int i=0; i<list.size(); i++){
			         		BrandDO brandDO = (BrandDO) list.get(i);
         			%>
						<li> <a href="/liquor/productHome.do?brandId=<%=brandDO.getId()%>"><img src="/liquor/resources/images/small/<%=brandDO.getImage()%>" alt="<%=brandDO.getName()%>" /></a></li>
					<% count = count + 1; 
					}%>
				</ul>
				<!-- End Elastislide Carousel -->
			</div>
		</div>
		
         <!-- New Section Ends Here -->
         <!-- Featured Brand Section Ends Here -->
         
         
         <div class="clear"></div>
          <!-- Gap -->
         <div id="box"></div>
         <div class="clear"></div>
         
         <!-- Details Section Commence from Here -->
        <div id="grey_box">
         	<div id="grey_wrapper">
            	<div class="clear"></div>
            	<div id="quote">
                	<div id="quote_img"><img src="/liquor/resources/images/quotes.jpg" alt="quotes"/></div>
                    <p class="pad_left">I am very satisfied with the quality and timely delivery of the cake I ordered.for a friend and she is very happy too.
                    </p>
                    <h5>- Anushka Kapur (22 Feb 2013)</h5>
             	</div>
				<div id="payment">
                	<p>PAYMENT METHODS</p>
                    <div id="payment_imgcon" class="pad-left"><a href="#"><img src="/liquor/resources/images/visa.jpg" alt="" /></a></div>
                    <div id="payment_imgcon"><a href="#"><img src="/liquor/resources/images/master.jpg" alt="" /></a></div>
                    <div id="payment_imgcon"><a href="#"><img src="/liquor/resources/images/cash.jpg" alt="" /></a></div>
                </div>
                <div id="social_net">
                	<div id="social_imgcon"><img src="/liquor/resources/images/social-label.jpg" alt="Social-icon" /></div>
                     <div id="social_item"><a href="https://www.facebook.com/pages/Swadar-Constructions/583307835028687" class="social_col1">&#228;</a></div>
                    <div id="social_item"><a href="" class="social_col2">&#240;</a></div>
                    <div id="social_item"><a href="" class="social_col3">&#229;</a></div>
                    <div id="social_item"><a href="" class="social_col4">&#237;</a></div>
                </div>
                <div class="clear"></div>
         	</div>
          	<div class="clear"></div>
            <div id="infolink_wrapper">
            	<div id="info">
                	<h5>Information</h5>
                    <a href="#">About us</a><br><br>
                    <a href="#">Contact</a><br><br>
                    <a href="#">Order Tracking</a><br><br>
                    <a href="#">Payment Options</a><br><br>
                    <a href="#">Cancelation &amp; Returns</a>
                </div>
                <div id="policy">
                	<h5>policies</h5>
                    <a href="#">Terms and Conditions</a><br><br>
                    <a href="#">Privacy Policy</a>
                </div>
                <div id="contact_detail">
                	 <form action="" method="post">
                		<input type="email" name="your-email" placeholder="you@yourmail.com"  class="cform-text" required>
              			<input type="submit" value="SUBMIT" class="cform-submit">
                	</form>
                    <p>Enter your e-mail to recieve our offers, news etc.,<br>*Your data will not be shared with others and you can unsubscribe at any time.</p>
                </div>
            	<div class="clear"></div>
            </div> 
     	</div>
        <div class="clear"></div>
        <!-- Footer Section Commence From Here-->
        <footer>
        	<div id="footer_wrapper">
           		 <span>&copy; 2013 Cake of the Day. All Rights Reserved.</span>
                 <a href="#">Shipping &amp; Delievery Policies</a>
                 <a href="#">Cancelation &amp; Modification Policies</a>
                 <a href="#">Gift Card Policies</a>
                 <a href="#">Orders &amp; Returns</a>
                 <a href="#">Payment Policies</a>
        	</div>
        </footer>
	</div>
    
    <!-- This Section is for pop-up code -->
    
        <div id="toPopup"> 
		<div class="close"></div>
       	<span class="ecs_tooltip">Press Esc to close <span class="arrow"></span></span>
		<div id="popup_content"> <!--your content start-->
            <header><h1 class="header_color">MEMBER SIGN IN</h1>
            	<span>Already member? you may sign in here.</span>
                
         	</header>
            <div class="clear"></div>
            <div class="social_btncontainer">
            	
            	<a href="http://www.google.com">
                	<div class="btn_facebookcontainer">
            			<div class="social_imgcon facebook_btn"><img src="/liquor/resources/images/Login-facebook.jpg"/></div>
                    	<div class="social_text">&nbsp;&nbsp;&nbsp;Sign in With Facebook</div>
                    </div>
                </a>
                <div class="clear"></div>
                <a href="http://www.google.com">
                	<div class="btn_googlecontainer">
            			<div class="social_imgcon google_btn"><img src="/liquor/resources/images/Login-google.jpg"/></div>
                    	<div class="social_text">&nbsp;&nbsp;&nbsp;Sign in With google</div>
                    </div>
                </a>
                 <p>Not a member yet? <a href="#" class="topopup_2 underline_link">SIGN UP</a></p>
                </div>
                <div class="border_container">
                	<p><img src="images/popborder.jpg" /></p>
                </div>
                <form class="contact_form" action="/liquor/Login.do" method="">
                <div class="login_detail">
                	
                		<input type="email" name="email" id="email_text" placeholder="Email:" required/><br><br>
                    	<input type="password" name="password" placeholder="Password:" required/><br><br>
                        <input class="check_remin" type="checkbox" name="reminder" value="" /><span>Remember Me</span>
                    	<button class="submit" type="submit">SIGN IN</button><br><br>
                        <div class="clear"></div>
                        <div class="forgot_alignment"><a href="#" class="topopup_3">Forgot Password</a></div>
                   
                </div>
            </form>
        </div> <!--your content end-->
	</div> <!--toPopup end-->
    
    <div id="toPopup_2"> 
    	<div class="close"></div>
       	<span class="ecs_tooltip">Press Esc to close <span class="arrow"></span></span>
		<div id="popup_content"> <!--your content start-->
            <header><h1 class="header_color1">NEW USER JOIN NOW!</h1>
            	<span>Welcome Guest.</span>
                
         	</header>
            <div class="clear"></div>
            <div class="signup_btncontainer">
            	
            	<a href="http://www.google.com">
                	<div class="btn_facebookcontainer">
            			<div class="social_imgcon facebook_btn"><img src="/liquor/resources/images/Login-facebook.jpg"/></div>
                    	<div class="social_text">&nbsp;&nbsp;&nbsp;Sign in With Facebook</div>
                    </div>
                </a>
                <div class="clear"></div>
                <a href="http://www.google.com">
                	<div class="btn_googlecontainer">
            			<div class="social_imgcon google_btn"><img src="/liquor/resources/images/Login-google.jpg"/></div>
                    	<div class="social_text">&nbsp;&nbsp;&nbsp;Sign in With google</div>
                    </div>
                </a>
                 <p>Already a member? <a href="#" class="topopup underline_link">SIGN IN</a></p>
                </div>
                <div class="border_container border_topspace">
                	<p><img src="images/popborder.jpg" /></p>
                </div>
                <div class="login_detail">
                	<form class="contact_form" action="/liquor/saveUser.do" method="">
                    	<input type="text" name="name"  placeholder="Name:" oninput="check(this)" required/><br><br>
                		<input type="email" name="eMail"  placeholder="Email:" required/><br><br>
                    	<input type="password" name="password" placeholder="Password:" required/><br><br>
                        <input type="radio" name="gender" value="Male" checked="true" />Male
                        <input type="radio" name="gender" value="Female" checked="false" />Female
                    	<button class="submit" type="submit">SIGN UP</button><br><br>
                        <div class="clear"></div>
                        <p class="top-alignp">I agree to&nbsp;<a href="#" class="topopup_2 underline_link">Terms &amp; Conditions</a></p>
                    </form>
                </div>
           
        </div> <!--your content end-->
	</div> <!--toPopup end-->
    
    <div id="toPopup_3"> 
		<div class="close"></div>
       	<span class="ecs_tooltip">Press Esc to close <span class="arrow"></span></span>
		<div id="popup_content"> <!--your content start-->
        	 <header><h1 class="header_color1">HAVE YOU FORGOTTEN YOUR PASSWORD?</h1><br>
            	<p>Please enter your email address below to retrieve your password?</p><br>
        	</header>
            <div class="forgot_container">
                <form class="forgot_form" action="" method="">
                    <input type="email" name="email"  placeholder="Email:" required/>
                    <button class="submit" type="submit">SUBMIT</button><br><br>
                    <div class="clear"></div>
                </form>
            </div>
        </div> <!--your content end-->
	</div> <!--toPopup end-->
    
	<div class="loader"></div>
   	<div id="backgroundPopup"></div>
    
    <!--  Pop Section Ends Here -->
    
	
		<script src="/liquor/resources/js/cbpHorizontalMenu.min.js"></script>
		<script>
			$(function() {
				cbpHorizontalMenu.init();
			});
		</script>
		<%if(productList.size() > 7){ %>
         <script type="text/javascript">
		$(function(){
			var perPage = 8;
			var opened = 1;
			var onClass = 'on';
			var paginationSelector = '.pages';
			$('#product_wrapper').simplePagination(perPage, opened, onClass, paginationSelector);
		});
	</script>
	<%}%>
</body>
</html>
